﻿@model List<Com.Charence.PassManager.BusinessEntities.AccountBase>
@{
    ViewBag.Title = "AccountGrid";
}

@section CustomScripts{
    <script type="text/javascript">
        $(function () {
            $("a[data-action='show-pass']").mousedown(function () {
                var elem = $(this).parent().find("strong");
                if (elem.html().indexOf("******") > -1)
                    elem.html(elem.data("code"));
                else
                    elem.html("******");
            });
        });
    </script>
}

<ol class="breadcrumb">
    <li><a href="@Url.Action("Index", "Dashboard")">Home</a></li>
    <li><a href="@Url.Action("AccountGrid", "Account")">Account</a></li>
    <li class="active"><a href="@Url.Action("AccountGrid", "Account")">My Account</a></li>
</ol>

<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                <div><strong>New Account</strong></div>
            </div>
            <div class="panel-body">
                <table class="table table-striped">
                    <thead>
                        <tr>
                            <th>Account Owner</th>
                            <th>User Name</th>
                            <th>Password</th>
                            <th>Last Update</th>
                            <th>Status</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var account in Model)
                        {
                            <tr>
                                <td>@account.WebSiteName</td>
                                <td>@account.Account</td>
                                <td>
                                    <div style="position: relative;">
                                        <strong style="position: absolute;top:5px; left:0;" class="" data-code="@account.Password">******</strong>
                                        <a data-action="show-pass" href="#" class="btn btn-link btn-xs pull-right">
                                            <i class="fa fa-eye"></i>   
                                        </a>
                                    </div>
                                </td>
                                <td>@account.UpdatedOn.ToShortDateString()</td>
                                <td><span class="label label-success">Active</span></td>
                                <td><a href="#" class="btn btn-info btn-xs"><i class="fa fa-search-plus"></i> View Detail</a></td>
                            </tr> 
                        }
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
